<template>
	<view class="customed-form">
		<view class="customed-form_head">
			<view class="customed-form_head_select">
				<view class="customed-form_head_select_label">
					目的地
				</view>
				<view class="customed-form_head_select_value">
					乌鲁木齐
				</view>
			</view>
			<view class="customed-form_head_mdd">
				<view class="customed-form_head_mdd_item">
					乌鲁木齐
				</view>
				<view class="customed-form_head_mdd_item">
					阿勒泰
				</view>
				<view class="customed-form_head_mdd_item">
					伊犁
				</view>
				<view class="customed-form_head_mdd_item">
					吐鲁番
				</view>
			</view>
		</view>

		<view class="customed-form_body">
			<input class="customed-form_body_input" type="text" placeholder="请填写手机号，便于联系您" />
			<button class="customed-form_body_button">马上为我定制</button>
			<view class="customed-form_body_tips">
				手机号仅用于联系您使用，不会推销任何广告。
			</view>
		</view>
	</view>
</template>

<script>

</script>

<style lang="scss" scoped>
	.customed-form {
		&_body {
			&_tips{
				font-size: 24rpx;
				text-align: center;
				color: #999;
				margin-top: 20rpx;
			}
			&_input {
				font-size: 32rpx;
				margin: 50rpx 0;
			}

			&_button {
				background: var(--color);
				color: #fff;
			}
		}


		&_head {
			&_select {
				font-size: 38rpx;
				display: flex;
				align-items: center;
				margin: 20rpx 0 30rpx;

				&_label {
					font-weight: bold;
					margin-right: 20rpx;
				}
			}

			&_mdd {
				display: flex;
				align-items: center;
				border-bottom: 1rpx solid #eee;
				padding-bottom: 20rpx;
				margin-bottom: 40rpx;

				&_item {
					margin-right: 15rpx;
					background: #f7f8f9;
					padding: 4rpx 20rpx;
					border-radius: 6rpx;
					color: #777;
					font-size: 24rpx;
				}
			}
		}
	}
</style>